<template>
  <div class="app-container">
    <el-table
      :data="tableData.filter(data => !search || data.name.toLowerCase().includes(search.toLowerCase()))"
      style="width: 100%"
    >
      <el-table-column
        label="用户名"
        align="center"
        prop="account"
      />
      <el-table-column
        label="创建时间"
        align="center"
        prop="create_time"
      />
      <el-table-column
        label="最后登录时间"
        align="center"
        prop="last_login_time"
      />
      <el-table-column
        label="最后登录ip"
        align="center"
        prop="last_login_ip"
      />
      <el-table-column
        label="用户状态"
        align="center"
        prop="status"
      />
      <el-table-column>
        <template slot="header">
          <el-input
            v-model="search"
            size="mini"
            placeholder="输入关键字搜索"
          />
          <el-button
            size="mini"
            @click=" findUserByCondition(search)"
          >查询</el-button>
        </template>
        <template slot-scope="scope">
          <el-button
            size="mini"
            @click="handleEdit(scope.$index, scope.row)"
          >编辑</el-button>
          <template>
            <el-popconfirm
              title="确定删除选定用户吗?"
              @onConfirm="handleDelete(scope.$index, scope.row)"
            >
              <el-button slot="reference" size="mini">删除</el-button>
            </el-popconfirm>
          </template>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import { findAllUser } from '@/api/user_hyperion'
import { deleteUser } from '@/api/user_hyperion'
import { findByCondition } from '@/api/user_hyperion'
export default {
  data() {
    return {
      tableData: [],
      search: ''
    }
  },
  created() {
    findAllUser().then(res => {
      this.tableData = res.data
    })
  },
  methods: {
    handleEdit(index, row) {
      console.log(index, row)
    },
    handleDelete(index, row) {
      var data = [row.id]
      deleteUser(data)
      this.tableData = this.tableData.filter((element, i) => {
        return this.tableData[index].id !== element.id
      })
    },
    findUserByCondition(search) {
      // alert(search)
      let user = []
      findByCondition(search).then(res => {
        user = res.data
        this.tableData = user
        // this.tableData = [{ id: 2, account: 'admin1', create_time: '2022-01-18 10:30:57', last_login_time: '2022-01-20 11:43:52', last_login_ip: '0:0:0:0:0:0:0:1', status: 'y' }]
        console.log(user)
      })
      this.tableData = user
    },
    confirm(index, row) {
      var data = [row.id]
      deleteUser(data)
      this.tableData = this.tableData.filter((element, i) => {
        return this.tableData[index].id !== element.id
      })
    }
  }
}
</script>
